<%@ page language="java" contentType="text/html; charset=UTF-8"
	pageEncoding="UTF-8"%>
<%@ taglib prefix="s" uri="/struts-tags"%>
<!DOCTYPE html>
<html lang="en">
<head>
<jsp:include page="core/templates/header.jsp"></jsp:include>
</head>
<body class="header1 activateAppearAnimation">
	<div id="globalWrapper">
		<jsp:include page="core/templates/mainMenu.jsp"></jsp:include>
		<jsp:include page="core/templates/banner.jsp"></jsp:include>
		<!-- Content -->
		<section id="content"
			style="background: url('core/images/feature.png') repeat;">
			<div class="container">
				<div class="row mt30 mb15">
					<div class="col-md-12">
						<h2>ประกาศงาน ฟรี!</h2>
					</div>
				</div>
				<div class="row mb30">
					<div class="col-md-10">
						<div class="mt15 boxcontent color1" style="margin: auto;">
							<s:form action="summitPostJob" method="post"
								enctype="multipart/form-data" theme="simple">
								<div class="row">
									<h3>
										<span class="label label-info"><b>ขั้นตอนที่ 1.</b></span> <b>รายละเอียดของงาน</b>
									</h3>
								</div>
								<div class="row mt15 boxFocus color0">
									<div class="row mt05">
										<div class="col-md-2">
											<b>ชื่องาน :</b>
										</div>
										<div class="col-md-10">
											<s:textfield  cssClass="form-control" id="input_jobName"
												placeholder="กรุณาระบุชื่อของงานให้ชัดเจน"></s:textfield>
										</div>
									</div>
									<div class="row mt05">
										<div class="col-md-2">
											<b>ทักษะที่เกี่ยวข้อง :</b>
										</div>
										<div class="col-md-10">
											<s:textfield id="input_aptitude"
												cssClass="form-control" placeholder=""></s:textfield>
										</div>
									</div>
									<div class="row mt05">
										<div class="col-md-2">
											<b>รายละเอียดของงาน</b>
										</div>
										<div class="col-md-10">
											<s:textarea id="input_description"
												cssClass="form-control"
												placeholder="กรุณาระบุรายละเอียดของงานให้ชัดเจน" rows="10"></s:textarea>
										</div>
									</div>
									<div class="row mt05">
										<div class="col-md-2">
											<b>จังหวัด :</b>
										</div>
										<div class="col-md-4">
											<select class="form-control" id="input_workArea">
												<option value="">--- เลือก ---</option>
												<option>เชียงใหม่</option>
												<option>เชียงราย</option>
												<option>แพร่</option>
												<option>น่าน</option>
												<option>ลำปาง</option>
											</select>
										</div>
									</div>
									<div class="row mt05">
										<div class="col-md-2">
											<b>ระยะเวลาการทำงาน :</b>
										</div>
										<div class="col-md-2">ตั้งแต่วันที่ทำงาน</div>
										<div class="col-md-3">
											<input type="date" class="form-control" id="input_startDate">
										</div>
										<div class="col-md-2">สิ้นสุดวันที่ทำงาน</div>
										<div class="col-md-3">
											<input type="date" class="form-control" id="input_endDate">
										</div>
									</div>
								</div>
								<div class="row mt15">
									<h3>
										<span class="label label-info"><b>ขั้นตอนที่ 2.</b></span>
										รายละเอียดค่าตอบแทน
									</h3>
								</div>
								<div class="row mt15 boxFocus color0">
									<div class="row mt05">
										<div class="col-md-2">
											<b>ค่าตอบแทน :</b>
										</div>
										<div class="col-md-7">
											<div class="row">
												<div class="col-md-12">
													<s:select cssClass="form-control" id="select_wageType"
														
														list="#{'0':'---- เลือก ----', 
														'1':'คิดแบบเหมาจ่ายทั้งงาน',
														'2':'คิดรายชั่วโมง',
														'3':'คิดรายวัน',
														'4':'คิดรายเดือน',
														'5':'เปิดโอกาสให้ผู้สนใจเสนอราคาเข้ามา'}" />
												</div>
											</div>
											<div class="row mt05" id="div_wage1">
												<div class="col-md-2 col-xs-8 col-sm-8 control-label">
													ราคางาน</div>
												<div class="col-md-9 col-xs-8 col-sm-8 control-label">
													<s:textfield id="fixPrice1" cssClass="form-control"
														placeholder="กรุณากรอกเป็นตัวเลขเท่านั้น" ></s:textfield>
												</div>
												<div class="col-md-1">บาท</div>
											</div>
											<div class="row mt05" id="div_wage2">
												<div class="col-md-2 col-xs-8 col-sm-8 control-label">
													ชั่วโมงละ</div>
												<div class="col-md-9">
													<s:textfield id="fixPrice2" cssClass="form-control"
														placeholder="กรุณากรอกเป็นตัวเลขเท่านั้น"></s:textfield>
												</div>
												<div class="col-md-1">บาท</div>
											</div>
											<div class="row mt05" id="div_wage3">
												<div class="col-md-2 col-xs-8 col-sm-8 control-label">
													วันละ</div>
												<div class="col-md-9">
													<s:textfield id="fixPrice3" cssClass="form-control"
														placeholder="กรุณากรอกเป็นตัวเลขเท่านั้น"></s:textfield>
												</div>
												<div class="col-md-1">บาท</div>
											</div>
											<div class="row mt05" id="div_wage4">
												<div class="col-md-2 col-xs-8 col-sm-8 control-label">
													เดือนละ</div>
												<div class="col-md-9">
													<s:textfield id="fixPrice4" cssClass="form-control"
														placeholder="กรุณากรอกเป็นตัวเลขเท่านั้น"></s:textfield>
												</div>
												<div class="col-md-1">บาท</div>
											</div>
											<div id="div_wage5">
												<div class="row mt05">
													<div class="col-md-3 col-xs-8 col-sm-8">ราคาต่ำสุด</div>
													<div class="col-md-7 col-xs-8 col-sm-8 control-label">
														<s:textfield name="job.paymentOfJob.minPrice"
															cssClass="form-control" id="minPrice"
															placeholder="กรุณากรอกเป็นตัวเลขเท่านั้น"></s:textfield>
													</div>
													<div>บาท</div>
												</div>
												<div class="row mt05">
													<div class="col-md-3">ราคาสูงสุด</div>
													<div class="col-md-7 col-xs-8 col-sm-8 control-label">
														<s:textfield name="job.paymentOfJob.maxPrice"
															cssClass="form-control" id="maxPrice"
															placeholder="กรุณากรอกเป็นตัวเลขเท่านั้น"></s:textfield>
													</div>
													<div>บาท</div>
												</div>
											</div>
										</div>
									</div>
								</div>
								<div class="row mt15">
									<h3>
										<span class="label label-info"><b>ขั้นตอนที่ 3.</b></span>
										ภาพประกอบงาน
									</h3>
								</div>
								<div class="row mt15 boxFocus color0">
									<div class="row">
										<div class="col-md-2">
											<b>รูปภาพงาน :</b>
										</div>
										<div class="col-md-10">
											<s:textfield id="input_pictureLocation"
												cssClass="form-control" placeholder=""></s:textfield>
										</div>
									</div>
								</div>
								<div class="row mt15">
									<h3>
										<span class="label label-info"><b>ขั้นตอนที่ 4.</b></span>
										ข้อเสนอแนะเพิ่มเติม
									</h3>
								</div>
								<div class="row mt15 boxFocus color0">
									<div class="row">
										<div class="col-md-12">
											<b>ท่านสามารถเลือกโปรโมชั่นการประกาศงาน
												เพิ่มเดิมได้ดังนี้</b>
										</div>
									</div>
									<div class="row mt05">
										<div class="col-md-12">
											<table class="table table-hover">
												<thead>
													<tr>
														<th style="text-align: center;">เลือก</th>
														<th width="30%">รายการ</th>
														<th>หมายเหตุ</th>
														<th class="textCenter" width="15%">ค่าใช้จ่าย(เหรียญ)</th>

													</tr>
												</thead>
												<tbody>
													<s:iterator value="model.listPromotion" status="idPromotion">
														<tr>
															<td><s:checkbox fieldValue="true" name="promotionID"
																	value="model.listPromotion.promotionID"/></td>
															<td><s:property value="promotionName" /></td>
															<td><s:property value="description" /></td>
															<td align="center"><s:property value="serviceCharge" /></td>
														</tr>
													</s:iterator>
													<tr>
														<td></td>
														<td></td>
														<td><b>ค่าใช้จ่ายทั้งหมดในการประกาศงาน</b></td>
														<td align="center"><b><s:label
																	id="span_totalCharge"></s:label>เหรียญ</b></td>
													</tr>
												</tbody>

											</table>
										</div>
									</div>
								</div>
								<div class="row mt15">
								<div class="col-md-12">
									<div align="center">
										<button type="button"
											class="btn btn-labeled btn-info font4" onclick="validateData();">
											<span class="btn-label"><i
												class="icon-check"></i></span>ตรวจสอบข้อมูล
										</button>
										<button type="reset"
											class="btn btn-labeled btn-warning font4">
											<span class="btn-label"><i
												class="icon-trash"></i></span>ล้างข้อมูล
										</button>
									</div>
								</div>
							</div>
							</s:form>
						</div>
						<!-- End content -->

						<div class="row mt15">
							<div class="col-md-12">

								<div class="mt15 ctaBox color1" style="margin: auto;">
									<div class="row">
										<h3>
											<span class="label label-info"><b>ขั้นตอนที่ 5.</b></span>
											ตรวจสอบความถูกต้อง
										</h3>
									</div>
									<div class="row mt15 boxFocus color0">
										<div class="row">
											<div class="col-md-3">
												<b>ชื่องาน :</b>
											</div>
											<div class="col-md-6"><span id="span_jobName"></span></div>

										</div>
										<div class="row mt05">
											<div class="col-md-3">
												<b>ทักษะที่เกี่ยวข้อง :</b>
											</div>
											<div class="col-md-6">
												<span id="span_aptitude"></span>
											</div>

										</div>
										<div class="row mt05">
											<div class="col-md-3">
												<b>รายละเอียดของงาน :</b>
											</div>
											<div class="col-md-9">
												<span id="span_description"></span>
											</div>

										</div>
										<div class="row mt05">
											<div class="col-md-3">
												<b>จังหวัด :</b>
											</div>
											<div class="col-md-9">
												<span id="span_workArea"></span>
											</div>

										</div>
										<div class="row mt05">
											<div class="col-md-3">
												<b>ระยะเวลาการทำงาน</b>
											</div>
											<div class="col-md-9">
												<span id="span_startDate"></span>&nbsp;-&nbsp;<span id="span_endDate"></span>
											</div>

										</div>
										<div class="row mt05">
											<div class="col-md-3">
												<b>ประเภทค่าว่าจ้าง :</b>
											</div>
											<div class="col-md-9">
												<span id="span_wageType"></span>
											</div>

										</div>
										<div class="row mt05">
											<div class="col-md-3">
												<b>ค่าตอบแทน :</b>
											</div>
											<div class="col-md-9">
												<span id="span_price"></span>
											</div>

										</div>
										<div class="row mt05">
											<div class="col-md-3">
												<b>โปรโมชั่น :</b>
											</div>
											<div class="col-md-9">
												<span id="span_showPro2"></span>
											</div>

										</div>
									</div>

									<div class="row mt15">
										<div class="col-md-12">
											<div class="checkbox">
												<label class="font3"> <input type="checkbox"
													name="x">
													ข้าพเจ้าได้รับทราบและยืนยันตกลงตามเงื่อนไข ข้อตกลง
													ค่าธรรมเนียมการให้บริการข้างต้น
												</label>
											</div>
											<div align="center">
												<button type="button"
													class="btn btn-labeled btn-success font5">
													<span class="btn-label"><i
														class="glyphicon glyphicon-ok"></i></span>ยืนยันการว่าจ้างงาน
												</button>
												<button type="button"
													class="btn btn-labeled btn-danger font5">
													<span class="btn-label"><i
														class="glyphicon glyphicon-remove"></i></span>ยกเลิกการว่าจ้างงาน
												</button>
											</div>
										</div>
									</div>
								</div>
							</div>
						</div>
					</div>
				</div>
			</div>
		</section>
		<!-- Content -->
		<jsp:include page="core/templates/footer.jsp" />
		<script type="text/javascript" src="custom/js/PostJobPage.js"></script>
	</div>
</body>
</html>